<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>循环结构</title>
	</head>
	<body>
		 <div id="app">
			 <!-- 数组的方法  java中的叫法push:入栈 pop弹栈
			 				push() 	在结尾追加元素
			 				pop()	删除最后一个元素
			 				shift()	删除第一个元素
			 				unshift() 在开头追加元素
			 				splice() 替换数组中的数据 !!!!
			 				sort()	 数据排序
			 				reverse() 数组反转
			 			 -->
			<span v-for="value in array">{{value}},
			</span><br>
			<input type="text" v-model="msg"><br>
			<button @click="push">增加</button>
			<button @click="pop">删除最后一个</button>
			<button @click="shift">删除第一个</button>
			<button @click="unshift">追加第一个</button>
			<button @click="splice">替换前两个</button>
			<button @click="splice1">替换最一个</button>
			<button @click="splice2">删除第二个</button>
			
			
			
		 </div>
		 
		 
		 
		 <script src="../js/vue.js"> </script>
		 <script>
			const APP =new Vue({
				el: "#app",
				data: {
					array:['a','s',1],
					msg:""
				},
				methods:{
					push(){
						this.array.push(this.msg)
					},
					pop(){
						this.array.pop()
					},
					shift(){
						this.array.shift()
					},
					unshift(){
						this.array.unshift(this.msg)
					},
					splice(){
						this.array.splice(0,2,this.msg,this.msg)
					},
					splice1(){
						let char=this.array.length-1;
						this.array.splice(char,1,this.msg)
					},
					splice2(){
						
						this.array.splice(1,1)
					}
				}
			})
		 </script>
	</body>
</html>
